<template>
	<view class="container">
		<view class="info">
			<view class="top">
				<view class="title">地址信息</view>
			</view>
			<view @click="editAddress">
				<view class="user">
					<text v-if="addressInfo.addId">{{addressInfo.name}} {{addressInfo.phone}}</text>
					<text v-else style="color: #8e8e8e;">请选择或新建地址</text>
					<u-icon name="arrow-right"></u-icon>
				</view>
				<text class="address"
					v-if="addressInfo.addId">{{addressInfo.province}}{{addressInfo.city}}{{addressInfo.district}}{{addressInfo.address}}</text>
				<view class="line" v-else> </view>
			</view>
			<view class="warning">
				<u-icon name="warning-fill" color="#d81e06"></u-icon>
				<span>因物流成本原因，上门服务地区暂不包括：西藏、新疆、青海、甘肃、内蒙古、宁夏、黑龙江、港澳台。</span>
			</view>
		</view>
		<view class="info">
			<view class="top">
				<view class="title">
					捐赠信息
				</view>
			</view>
			<view class="form_title">
				<view class="form_item">名称：</view>
				<u-input v-model="goodsInfo.title" border="bottom" readonly>
				</u-input>
			</view>
			<view class="form_title">
				<view class="form_item">新旧：</view>
				<u-input v-model="goodsInfo.author" border="bottom" disabled disabledColor="#fff">
				</u-input>
			</view>
			<view class="form_title">
				<view class="form_item2">图片：</view>
			</view>
			<view class="picBox">
				<image :src="goodsInfo.picture" mode="aspectFit"></image>
			</view>
		</view>
		<view class="btn">
			<u-button text="提交信息" color="#d81e06" @click="admitForm"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addressInfo: {},
				goodsInfo: {},
			}
		},
		onLoad(options) {
			if (options) {
				this.goodsInfo = JSON.parse(decodeURIComponent(options.info))
			}
		},
		onShow(info) {
			if (info) {
				this.addressInfo = JSON.parse(decodeURIComponent(info)).res;
				console.log(this.addressInfo);
			}
		},
		methods: {
			// 点击选择地址
			editAddress() {
				uni.navigateTo({
					url: '/page_mine/Address',
				});
			},
			// 提交表单
			async admitForm() {
				if (!this.addressInfo.addId) {
					uni.showToast({
						title: '地址不能为空！',
						icon: 'none'
					})
				}
				const {
					data: res
				} = await this.$myRequest({
					url: '/order/addDonaOrder',
					method: 'post',
					data: {
						userIdFrom:this.goodsInfo.addIdFrom,
						userIdTo:uni.getStorageSync('userId'),
						addIdFrom:this.goodsInfo.addIdFrom,
						addIdTo:this.addressInfo.addId,
						goodsId:this.goodsInfo.goodsId
					}
				})
				if (res.code === 20000) {
					uni.showToast({
						title: '提交成功，可在个人中心查看状态。',
						icon:'none'
					})
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/Index'
						})
					}, 1500)
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		background-color: #fff;
		border-radius: 20rpx;
		margin: 20rpx;
		padding: 5rpx 40rpx;
	}

	.info {
		margin-top: 40rpx;

		.top {
			display: flex;
			justify-content: space-between;
			margin-bottom: 20rpx;

			.title {
				font-weight: bold;
			}
		}

		.user {
			display: flex;
			justify-content: space-between;
			color: #666666;
		}

		.address {
			font-size: smaller;
			color: lightgray;
		}

		.line {
			height: 1px;
			background-color: lightgray;
			margin-top: 30rpx;
		}


		.warning {
			margin-top: 20rpx;
			font-size: small;
			color: #8a8a8a;
			display: flex;

			/deep/ .u-icon {
				width: 32rpx;
				height: 32rpx;
			}
		}

		.form_title {
			display: flex;

			.form_item {
				width: 100rpx;
				display: flex;
				align-items: center;
				justify-content: flex-end;
			}
		}

		.form_item2 {
			margin: 10rpx 0;
		}

		.picBox {
			image {
				width: 250rpx;
				height: 280rpx;
			}

		}
	}

	.btn {
		width: 200rpx;
		margin: 20rpx auto;
	}
</style>
